<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      xmlns:f="http://xmlns.jcp.org/jsf/core">
    <body>
        <ui:composition template="./temp/main.xhtml">
            <ui:define name="head">
                Trang chủ
            </ui:define>

            <ui:define name="content">
                <div class="product-list-wrapper">
                    <ul class="product-list nolist clearfix">
                        <c:forEach var="p" items="#{productManaged.productIndexList}" >
                            <li>
                                <h:form>
                                    <c:if test="#{p.isSelling}">
                                        <span class="badge bestsell"></span>
                                    </c:if>
                                    <c:if test="#{p.isNew}">
                                        <span class="badge new">Mới</span>
                                    </c:if>
                                    <a alt="#{p.name}">
                                        <div class="img clearfix">
                                            <h:graphicImage value="#{p.imageName}"/>
                                        </div>
                                        <div class="name clearfix">
                                            <h3>
                                                #{p.name}
                                            </h3>
                                            <div class="price-list clearfix">
                                                <cite class="price" style="color: #FF0000; font-weight: bold; float: left; width: 100%;">
                                                    #{p.price} VND
                                                </cite>
                                                <c:if test="#{p.percent_Promotion != null}">
                                                    <span class="discount-note">Giảm <strong>#{p.percent_Promotion}%</strong></span>
                                                </c:if>
                                                <c:if test="#{p.accessory_Promotion != null}">
                                                    <span class="accessory-note">Tặng <strong>#{p.accessory_Promotion}</strong></span>
                                                </c:if>
                                            </div>
                                        </div>
                                    </a>
                                    <a id="#{p.productId}" class="more-detail clearfix" alt="#{p.name}">
                                        <h3 class="clearfix" style="font-weight: bold;">
                                            #{p.name}
                                        </h3>
                                        <div class="price-list clearfix" style="color: #FF0000; font-weight: bold; float: left; width: 100%;">
                                            <cite class="price">#{p.price}</cite> VND
                                        </div>

                                        <ul class="nolist clearfix" style="padding-top: 15px; padding-left: 10px">
                                            <h:outputText escape="false" value="#{p.specialInfo}"/>
                                        </ul>

                                        <div class="promotion clearfix" >
                                            <c:if test="#{p.percent_Promotion != null}">
                                                <span class="discount-note">Giảm <strong>#{p.percent_Promotion}</strong></span>
                                            </c:if>
                                            <c:if test="#{p.accessory_Promotion != null}">
                                                <span class="accessory-note">Tặng <strong>#{p.accessory_Promotion}</strong></span>
                                            </c:if>
                                        </div>

                                        <h:commandButton  value="Xem" action="pretty:productdetail" title="Xem chi tiết sản phẩm" style="right: 5px; bottom: 2px; position: absolute;">
                                            <f:setPropertyActionListener value="#{p}" target="#{productManaged.product}"/>
                                        </h:commandButton>
                                    </a>
                                </h:form>
                            </li>
                        </c:forEach>
                    </ul>
                </div>
            </ui:define>
        </ui:composition>
    </body>
</html>
